<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="/style.css" media="screen" />
<title>Activity</title>
<script type="text/javascript" src="/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.roundabout.js"></script>
<script type="text/javascript" src="/scripts/common.js"></script>
<script type="text/javascript">
$(function(){
	$('ul#myRoundabout').roundabout({
		tilt : 0.1,
		minScale : 1.0,
		maxScale : 1.0,
		minOpacity : -5.0,
		btnNext: '#next',
		btnPrev: '#prev'
	});
	$('li').focus(function() {
		$('#detail').html('').load('/promotion/detail/'+$(this).attr('id')).fadeIn(200);
	}).blur(function() {
		$('#detail').fadeOut(100);
	});
});
</script>
<style type="text/css">
ul li {
	float:left;
}
#news-main {
	position:relative;
	width:1000px;
	height:700px;
	margin:0 auto;
	overflow:hidden;
	background:url(../../images/bg/bg_transparent_b.png);/*background:#999;*/
}
#myRoundabout {
	top:185px;
}
#myRoundabout li img{
 max-height:350px;
}
.slide-pic {
	height:400px;
	width:1000px;
	position: relative;
	z-index: 1;
}
#detail {
	width:700px;
	height:250px;
	margin:10px auto;
	color:#fd0100 !important;
}
#detail h3 {
	background:url(../../images/bg/h_under.png) no-repeat bottom center;
}
#detail .description {
	margin-top:10px;
	font-size:12px;
}
.slide-nav {
	background:url(../../images/button/activity-nav.png) no-repeat center;
	width:1000px;
	height:16px;
	position:relative;
	z-index:700;
}
#prev, #next {
	width:115px;
	height:16px;
	display:block;
	position:relative;
	float:left;
	text-indent:-9999px;
}
#prev {
	left: 217px;
}
#next {
	left: 552px;
}
</style>
</head>
<body>
<!--$header_html-->
<div class="wrapper content-1">
  <div class="container">
    <div id="news-main">
      <div class="slide-pic">
        <ul id="myRoundabout">
          <!--SiXhEaD:list-->
          <li id="$content_id">$image </li>
          <!--/SiXhEaD:list-->
        </ul>
        <br class="clear" />
      </div>
      <div class="slide-nav"> <a href="#" id="prev">prev</a> <a href="#" id="next">next</a> </div>
      <div id="detail">
        <h3>$title</h3>
        <div class="description">$detail</div>
      </div>
    </div>
  </div>
</div>
<!--$footer_html-->
</body>
</html>